import React, { Component } from 'react'
import './index.less'
import api from '@MODULES/common/api'
import { NavLink, withRouter } from 'react-router-dom'
import store from 'store'
import Layout from '../../common/Layout'
import Header from '../../common/Header'
import { List, WhiteSpace, InputItem, Picker, TextareaItem, Toast } from 'antd-mobile';
import { createForm } from 'rc-form';

import UploadPic from '../../common/UploadPic'





class Index extends Component {

    constructor(props) {
        super(props)
        this.state = {
            initialization: true,
            imgFilesData: [],
        }
    }

    componentDidMount() {
    }
    onWindowResize() {
    }

    render() {
        const { getFieldProps, getFieldValue, setFieldsValue } = this.props.form;
        return (
            <Layout>
                {
                    this.state.initialization ? <div id="BFAddBaby">
                        <Header></Header>
                        <p className="bigSelectTitle">选填项</p>
                        <List>
                            <Picker data={this.state.pickerData} cols={1} {...getFieldProps('type_id', {
                                initialValue: ''
                            })}>
                                <List.Item arrow="horizontal">请选择提问对象</List.Item>
                            </Picker>
                            <TextareaItem
                                {...getFieldProps('question')}
                                title="问题描述："
                                placeholder="请描述你的问题"
                                data-seed="logId"
                                rows={5}
                                ref={el => this.customFocusInst = el}
                            />
                            <InputItem {...getFieldProps('mobile')} placeholder="请输入联系电话（可选）" type="number">
                                联系电话
                        </InputItem>
                        </List>
                        <p className="bigSelectTitle">选填项</p>
                        <div className="upImgBox">
                            <p className="title">图片</p>
                            <UploadPic picCount={6} imageFiles={this.state.imgFilesData} onChange={(imgFile) => this.imgOnChange(imgFile)}></UploadPic>
                        </div>

                        <button className="saveBtn" onClick={this.submission}>提交</button>

                    </div> : ''
                }
            </Layout>
        )
    }

    // 图片上传
    imgOnChange = (files, type, index) => {
        console.log(files, type, index);
        this.setState({
            imgFilesData: files,
        });
    }

    submission = () => {

        this.props.form.validateFields((error, value) => {

        })
    }
}
export default withRouter(createForm()(Index))